<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Adminique - admin template</title>
<meta charset="utf-8">

<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/skins/gray.css" title="gray">

<link rel="alternate stylesheet" type="text/css" href="css/skins/orange.css" title="orange">
<link rel="alternate stylesheet" type="text/css" href="css/skins/red.css" title="red">
<link rel="alternate stylesheet" type="text/css" href="css/skins/green.css" title="green">
<link rel="alternate stylesheet" type="text/css" href="css/skins/purple.css" title="purple">
<link rel="alternate stylesheet" type="text/css" href="css/skins/yellow.css" title="yellow">
<link rel="alternate stylesheet" type="text/css" href="css/skins/black.css" title="black">
<link rel="alternate stylesheet" type="text/css" href="css/skins/blue.css" title="blue">

<link rel="stylesheet" type="text/css" href="css/superfish.css">
<link rel="stylesheet" type="text/css" href="css/uniform.default.css">
<link rel="stylesheet" type="text/css" href="css/jquery.wysiwyg.css">
<link rel="stylesheet" type="text/css" href="css/facebox.css">
<link rel="stylesheet" type="text/css" href="css/smoothness/jquery-ui-1.8.8.custom.css">

<!--[if lte IE 8]>
<script type="text/javascript" src="js/html5.js"></script>
<script type="text/javascript" src="js/selectivizr.js"></script>
<script type="text/javascript" src="js/excanvas.min.js"></script>
<![endif]-->

<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.8.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/jquery.uniform.min.js"></script>
<script type="text/javascript" src="js/jquery.wysiwyg.js"></script>
<script type="text/javascript" src="js/superfish.js"></script>
<script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/Delicious_500.font.js"></script>
<script type="text/javascript" src="js/jquery.flot.min.js"></script>
<script type="text/javascript" src="js/custom.js"></script>
<script type="text/javascript" src="js/facebox.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/switcher.js"></script>

</head>
<body>

<header id="top">
	<div class="container_12 clearfix">
		<div id="logo" class="grid_5">
			<!-- replace with your website title or logo -->
			<a id="site-title" href="dashboard.html"><span>Admin</span>ique</a>
			<a id="view-site" href="#">View Site</a>
		</div>

		<div class="grid_4" id="colorstyle">
			<div>Change Color</div>
			<a href="#" rel="blue"></a>
			<a href="#" rel="green"></a>
			<a href="#" rel="red"></a>
			<a href="#" rel="purple"></a>
			<a href="#" rel="orange"></a>
			<a href="#" rel="yellow"></a>
			<a href="#" rel="black"></a>
			<a href="#" rel="gray"></a>
		</div>

		<div id="userinfo" class="grid_3">
			Welcome, <a href="#">Administrator</a>
		</div>
	</div>
</header>

<nav id="topmenu">
	<div class="container_12 clearfix">
		<div class="grid_12">
			<ul id="mainmenu" class="sf-menu">
				<li><a href="dashboard.html">Dashboard</a></li>
				<li><a href="styles.html">Styles</a></li>
				<li><a href="tables.html">Tables</a></li>
				<li><a href="forms.html">Forms</a></li>
				<li><a href="#">Sample Pages</a>
					<ul>
						<li><a href="news.html">News</a></li>
						<li><a href="gallery.html">Photo Gallery</a></li>
						<li class="current"><a href="settings.html">Settings</a></li>
						<li><a href="login.html">Login</a></li>
						<li><a href="1-column.html">1 Column Page</a></li>
						<li><a href="3-columns.html">3 Columns Page</a></li>
						<li><a href="sticky-footer.html">Sticky Footer</a></li>
					</ul>
				</li>
				<li><a href="#">Layout Width</a>
					<ul id="layoutwidth">
						<li><a href="#" rel="fixed">Fixed</a></li>
						<li><a href="#" rel="fluid">Fluid</a></li>
					</ul>
				</li>
			</ul>
			<ul id="usermenu">
				<li><a href="#" class="inbox">Inbox (3)</a></li>
				<li><a href="#">Logout</a></li>
			</ul>
		</div>
	</div>
</nav>

<section id="content">
	<section class="container_12 clearfix">
		<section id="main" class="grid_9">
			<article id="settings">
				<h1>Settings</h1>
				<form class="uniform">
					<ul class="tabs">
						<li><a href="#general">General</a></li>
						<li><a href="#seo">SEO</a></li>
						<li><a href="#membership">Membership</a></li>
					</ul>
					<div class="tabcontent">
						<div id="general">
							<dl class="inline">
								<dt><label for="site_title">Site Title</label></dt>
								<dd>
									<input type="text" id="site_title" class="medium" />
									<small>The title of your website</small>
								</dd>

								<dt><label for="tagline">Tagline</label></dt>
								<dd>
									<input type="text" id="tagline" class="medium" />
									<small>In a few words, explain what this site is about.</small>
								</dd>

								<dt><label for="site_url">Site URL</label></dt>
								<dd>
									<input type="text" id="site_url" class="medium" />
									<small>Your website address</small>
								</dd>

								<dt><label for="footer_text">Footer Text</label></dt>
								<dd>
									<textarea id="footer_text" class="medium"></textarea>
								</dd>

								<dt><label for="site_logo">Logo</label></dt>
								<dd>
									<input type="file" id="site_logo" />
									<small>Your website logo (jpg, gif, png)</small>
								</dd>
							</dl>
						</div>
						<div id="seo">
							<dl class="inline">
								<dt><label for="site_description">Description</label></dt>
								<dd>
									<textarea id="site_description" class="medium"></textarea>
									<small>The meta description of your website</small>
								</dd>

								<dt><label for="site_keyword">Keywords</label></dt>
								<dd>
									<textarea id="site_keyword" class="medium"></textarea>
									<small>The meta keywords of your website</small>
								</dd>

								<dt><label for="sitemap">Enable Sitemap</label></dt>
								<dd>
									<label><input type="checkbox" id="sitemap" value="1" />Enable</label>
								</dd>
							</dl>
						</div>
						<div id="membership">
							<dl class="inline">
								<dt><label for="admin_email">E-mail address </label></dt>
								<dd>
									<input type="text" id="admin_email" class="medium" />
									<small>This address is used for admin purposes, like new user notification</small>
								</dd>

								<dt><label for="membership2">Membership</label></dt>
								<dd>
									<label><input type="checkbox" id="membership2" value="1" />Anyone can register</label>
								</dd>

								<dt><label for="default_role">Default Role</label></dt>
								<dd>
									<select size="1" id="default_role">
										<option value="1">Administrator</option>
										<option value="2">Editor</option>
										<option value="3">Buyer</option>
										<option value="4">Seller</option>
									</select>
									<small>The default role of new user</small>
								</dd>

								<dt><label for="activation">Member Activation</label></dt>
								<dd>
									<select size="1" id="activation">
										<option value="1">Automatic</option>
										<option value="2">Manual</option>
									</select>
									<small>If manual selected, new users must be approved by admin</small>
								</dd>
							</dl>
						</div>
					</div>
					<div class="buttons">
						<button type="submit" class="button">Save Settings</button>
						<button type="button" class="button white">Cancel</button>
					</div>
				</form>
			</article>
		</section>
		
		<aside id="sidebar" class="grid_3">
			<div class="box info">
				<h2>Info</h2>
				<section>
					Example of sidebar on the right
				</section>
			</div>
			<div class="box menu">
				<h2>Side Menu</h2>
				<section>
					<ul>
						<li><a href="#">Menu Item 1</a></li>
						<li><a href="#">Menu Item 2</a></li>
						<li><a href="#">Menu Item 3</a></li>
						<li><a href="#">Menu Item 4</a></li>
						<li><a href="#">Menu Item 5</a>
							<ul>
								<li><a href="#">Menu Item 5.1</a></li>
								<li><a href="#">Menu Item 5.2</a>
									<ul>
										<li><a href="#">Menu Item 5.2.1</a></li>
										<li><a href="#">Menu Item 5.2.2</a></li>
									</ul>
								</li>
								<li><a href="#">Menu Item 5.3</a></li>
							</ul>
						</li>
						<li><a href="#">Menu Item 6</a></li>
					</ul>
				</section>
			</div>
		</aside>
	</section>
</section>

<footer id="bottom">
	<section class="container_12 clearfix">
		<div class="grid_6">
			<a href="#">Menu 1</a>
			&middot; <a href="#">Menu 2</a>
			&middot; <a href="#">Menu 3</a>
			&middot; <a href="#">Menu 4</a>
		</div>
		<div class="grid_6 alignright">
			Copyright &copy; 2011 <a href="#">YourCompany.com</a>
		</div>
	</section>
</footer>

</body>
</html>